<head>
	{% load movies_extras %}
	<meta charset="utf-8" />
	<title>Pref</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<meta name="description" content="Organize and keep track of all the movies in your life with useful rating and reviewing tools on Pref." />
	<meta name="author" content="Andy Hampton" />
	<meta name="robots" content="index, follow" />
	<meta name="google" content="notranslate" />
	<meta name="copyright" content="Andy Hampton" />
	<meta name="language" content="English" />
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	
	<!-- Le styles -->
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/bootstrap.css" />
    <style>
		body {
			padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
			padding-bottom: 40px;
		}
		
		{% if size %}
			#dhtmlgoodies_listOfItems ul{	/* Left(Sources) column <ul> */	
				height: {{size|multiply:25}}px;
			}
		{% endif %}
    </style>
    <link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/bootstrap-responsive.min.css" />
	<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/dragndrop.css" />
	<link rel="stylesheet" type="text/css" href="{{STATIC_URL}}css/starbox.css" />
	
	<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="{{STATIC_URL}}ico/favicon.ico" />
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{STATIC_URL}}ico/apple-touch-icon-144-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="{{STATIC_URL}}ico/apple-touch-icon-114-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="{{STATIC_URL}}ico/apple-touch-icon-72-precomposed.png" />
    <link rel="apple-touch-icon-precomposed" href="{{STATIC_URL}}ico/apple-touch-icon-57-precomposed.png" />
	
	
	<script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script type="text/javascript">
	if (!window.jQuery)
	{
		document.write(unescape("%3Cscript src='{{STATIC_URL}}js/jquery-1.7.2.min.js' type='text/javascript'%3E%3C/script%3E"));
	}
	</script>
	<!-- Le javascript
	extras:
	<script src="{{STATIC_URL}}js/bootstrap-modal.js"></script>
	<script src="{{STATIC_URL}}js/bootstrap-scrollspy.js"></script>
	<script src="{{STATIC_URL}}js/bootstrap-tab.js"></script>
	<script src="{{STATIC_URL}}js/bootstrap-alert.js"></script>
	<script src="{{STATIC_URL}}js/bootstrap-button.js"></script>
    <script src="{{STATIC_URL}}js/bootstrap-carousel.js"></script>
    ================================================== -->	
	
	<script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/prototype/1/prototype.js"></script>
	<script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/scriptaculous/1/scriptaculous.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/starbox.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/dragndrop.js"></script>
    <script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-transition.js"></script>
    <script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-dropdown.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-collapse.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-typeahead.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-tooltip.js"></script>
	<script type='text/javascript' src="{{STATIC_URL}}js/bootstrap-popover.js"></script>
	
	
	<script type="text/javascript">
		function setFocus(id)
		{
			document.getElementById(id).focus();
		}
		function confirmAction(str)
		{
			return confirm(str)
		}
	</script>
	<script language="javascript" type="text/javascript">
		function starboxChangedText(event) {
			var indicator = this.down('.indicator'),
			pick = (event.memo.rating || 0) * {{profile.SubStars}} - 1,
			indicator = this.down('.indicator');
			// for restoring, store the indicator text on the star if it was not set before.
			this.starboxResetText = this.starboxResetText || indicator.innerHTML;
			this.down('.indicator').update(
			["{{indicators|join:'","'}}"]
			[pick]);  
		}
		// when the link is clicked update the restore value
		function starboxRatedText() {
			var indicator = this.down('.indicator');
			this.starboxResetText = indicator.innerHTML;
		}
		// here we restore the indicator on mouseout, if needed
		function starboxLeftText() {
			this.down('.indicator').update(this.starboxResetText || '');
		}
		// attach the custom events after the DOM is loaded
		document.observe('dom:loaded', function() {
			$('rating').observe('starbox:changed', starboxChangedText) // observe the mouseover
			.observe('starbox:rated', starboxRatedText) // observe the click
			.observe('starbox:left', starboxLeftText); // observe the mouseout
		});

	</script>
	<script type="text/javascript">
		var _gaq = _gaq || [];
		_gaq.push(['_setAccount', 'UA-32590866-1']);
		_gaq.push(['_trackPageview']);

		(function() {
		var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
		})();
	</script>
</head>